@charset "utf-8";

@import "common/reset";

$border-color: #ff9344;

@function n($px){
    @return $px/2;
}


/*********************icon 小标题*************************/
.icon_hint{
    position: relative;
    font-size: 38px !important;
    span{
        background-color: red;
        position: absolute;
        display: inline-block;
        width: 14px;
        height: 14px;
        text-align: left;
        line-height: 14px;
        color: white;
        font-size: 12px;
        border-radius: 50%;
        padding-left: 3.6px;
        letter-spacing: 1px;
        overflow: hidden;
        -webkit-text-stroke: 0 transparent;
        -webkit-text-fill-color: white;
    }
}

.web{
    margin-bottom: 68px;
    position: relative;
    width: 100%;
    overflow: hidden;
    header{
//      height: n(150px);
        margin-bottom: 5px;
        .left{
            width: n(146px);
            img{
                width: n(123px);
                margin-left: n(22px);
                margin-top: n(17px);
            }
            a{
                display: inline-block;
                margin-top: n(49px);
                margin-left: n(23px);
                width: n(124px);
                height: n(57px);
                border: 2px solid $border-color;
                text-align: center;
                border-radius: n(17px);
                font-size: n(26px);
                line-height: n(50px);
            }
        }
        .right{
            width: n(184px);
            text-align: right;
//          overflow: hidden;
            select{
               -webkit-appearance: none;
                //清除select样式
               width: n(159px);
               height: n(55px);
               border: none;
               background: url(../images/xialakuang_06.png) no-repeat right n(12px) top n(20px) #ffffff;
               background-size: n(30px) n(16px);
               text-indent: n(13px);
               margin-right: n(22px);
               margin-top: n(48px);
               font-size: n(23px);
               &.select_border{
                   border: n(2px) solid $border-color;
                   border-radius: n(3px);
               }
            }
            i{
                display: inline-block;
                margin-right: n(22px);
                margin-top: n(28px);
                font-size: 23px;
                color: $border-color;
                span{
                    top: 6px;
                    right: 3px;
                }
            }
        }
        .center{
            overflow: hidden;
            .search{
                margin: 0 auto;
                width: n(268px);
                height: n(54px);
                margin-top: n(53px);
                line-height: n(54px);
                font-size: 0;
                text-align: center;
                &.input_border{
                    border: n(2px) solid $border-color;
                    border-radius: n(25px);
                }
                span{
                    font-size: n(26px);
                }
                input{
                    vertical-align: middle;
                    height: n(50px);
                    line-height: n(50px);
                    margin-left: n(18px);
                    padding: 0 n(4px);
                    font-size: n(24px);
                    border: none;
                    background: none;
//                  width: 100%;
                    width: n(200px);
                }
                i{
                    vertical-align: middle;
                    color: $border-color;
                    margin-left: n(-13px);
                    font-size: n(34px);
                }
                
            }
            p{
                text-align: center;
                margin-top: n(32px);
                font-size: 2.5vmax;
            }
        }
        .getseek{
            text-align: center;
            margin: 0 auto;
            width: 80%;
            li{
                display: inline-block;
                width: 23%;
                height: calc( white:100% * 1.5px);
//              line-height: n(64px);
                line-height: 6vmax;
                background-color: #dcdcdc;
                font-size: 2vmax;
                margin-top: 3px;
            }
        }
    }
     footer{
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        background-color: white;
        border-top: 1px solid $border-color;
        ul{
            li{
                float: left;
                width: 25%;
                a{
                    display: block;
                    text-align: center;
//                  background-color: beige;
                    margin-top: 2px;
                    i{
                        font-size: n(68px);
                        color: $border-color;
                        -webkit-text-stroke:1px $border-color;
                        -webkit-text-fill-color: transparent;
                        -webkit-transition:-webkit-text-fill-color 1s ease-in;
                        -moz-transition:-webkit-text-fill-color 1s ease-in;
                        transition:-webkit-text-fill-color 1s ease-in;
                    }
                    h2{
                        color: black;
                        font-size: n(26px);
                    }
                    &:hover{
                        i{
                            -webkit-text-fill-color: $border-color;
                        }
                    }
                }
                &.active{
                    i{
                        -webkit-text-fill-color: $border-color;
                        span{
                            display: none;
                        }
                    }
                }
            }
        }
    }
}

/**************优惠团购******************/
.Coupon{
    height: n(93px);
    .left{
        vertical-align: middle;
        height: n(93px);
        line-height: n(93px);
        float: left;
        margin-left: n(21px);
        color: $border-color;
        font-size: n(60px);
         span{
             color: black;
//           font-weight: bold;
             font-size: n(38px);
             margin-left: n(10px);
             max-width: 140px;
        }
    }
    .rigtht{
        float: right;
        height: n(93px);
        line-height: n(93px);
        margin-right: n(21px);
        vertical-align: middle;
        font-size: n(32px);
        color: black;
         i{
            margin-left: 5px;
            font-size: n(34px);
            color: $border-color;
        }
    }
}
/****************单行超出隐藏**********************/
.overflow{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
